<!DOCTYPE html>
<html class="landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
    <head>
        <title></title>
        <meta charset="utf-8">
        <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
        <link rel="stylesheet" href="file:///android_asset/common/css/fonts/supp-font-awesome.css"/>
        <link rel="stylesheet" href="file:///android_asset/common/css/supp-ui-core.css"/>
        <style>
            .supp-card {
                font-size: .24rem;
            }
        </style>
    </head>
    <body ontouchstart>
        <div class="pt-header h100p">
            <!-- 标题部分 -->
            <div id="header" class="supp-page-header">
                <div class="supp-header-left icon-fa-back hide"></div>
                <div class="supp-header-title">
                    js与原生交互
                </div>
                <div class="supp-header-right hide">
                    历史记录
                </div>
            </div>
            <!--header结束-->

            <!--content开始-->
            <div id="content" class="h100p">
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="scanQCode()">
                        扫描二维码
                    </div>
                </div>
                <div class="supp-card" @click="openCamera()">
                    <div class="supp-card-title-sm">
                        调用相机
                    </div>
                </div>
                <div class="supp-card" @click="openGallery()">
                    <div class="supp-card-title-sm">
                        打开相册
                    </div>
                </div>
                <div class="supp-card" @click="getLocation()">
                    <div class="supp-card-title-sm">
                        定位
                    </div>
                </div>
                <div class="supp-card" @click="getStep()">
                    <div class="supp-card-title-sm">
                        步数
                    </div>
                </div>
                <div class="supp-card" @click="orderPay()">
                    <div class="supp-card-title-sm">
                        支付
                    </div>
                </div>
                <div class="supp-card" @click="showToast()">
                    <div class="supp-card-title-sm">
                        弹出提示框
                    </div>
                </div>
                <div class="supp-card" @click="showAlert()">
                    <div class="supp-card-title-sm">
                        弹出确定框
                    </div>
                </div>
                <div class="supp-card" @click="showConfirm()">
                    <div class="supp-card-title-sm">
                        弹出确认框
                    </div>
                </div>
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="getDeviceInfo()">
                        获取硬件信息
                    </div>
                </div>
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="closePage()">
                        关闭页面
                    </div>
                </div>
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="openLocalWeb()">
                        打开H5页面
                    </div>
                </div>
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="openNativePage()">
                        打开原生页面
                    </div>
                </div>
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="callPhone()">
                        拨打电话
                    </div>
                </div>
                <div class="supp-card">
                    <div class="supp-card-title-sm" @click="uploadFile()">
                        上传文件
                    </div>
                </div>
            </div>

        </div>
    </body>
    <script src="file:///android_asset/common/js/supp-plugins.js"></script>
    <script src="file:///android_asset/common/js/supp-ui-core.js"></script>
    <script>
        var vueObj;
        jq(function() {
            vueObj = new Vue({
                el : "#content",
                data : {
                },
                methods : {
                    scanQCode : function(){
                        window.DhccWebView.scanQCode();
                    },
                    openCamera : function(){
                        window.DhccWebView.openCamera();
                    },
                    openGallery : function(){
                        window.DhccWebView.openGallery(3);
                    },
                    getLocation : function(){
                        window.DhccWebView.getLocation();
                    },
                    getStep : function(){
                        window.DhccWebView.getStep();
                    },
                    orderPay : function(){
                        window.DhccWebView.orderPay("NO1234","111.11","水电费");
                    },
                    showToast : function(){
                        window.DhccWebView.showToast("hello world");
                    },
                    showAlert : function(){
                        window.DhccWebView.showAlert("标题","hello world");
                    },
                    showConfirm : function(){
                        window.DhccWebView.showConfirm("标题","是否提交");
                    },
                    getDeviceInfo : function(){
                        window.DhccWebView.getDeviceInfo();
                    },
                    closePage : function(){
                        window.DhccWebView.closePage();
                    },
                    openLocalWeb : function(){
                        window.DhccWebView.openLocalWeb("estate/estate_list.html");
                    },
                    openNativePage : function(){
                        window.DhccWebView.openNativePage("mall");
                    },
                    callPhone : function(){
                        window.DhccWebView.callPhone("114");
                    },
                    uploadFile : function(){
                        window.DhccWebView.uploadFile("files://wgt/11.jpg","http://");
                    }
                    
                }
            });
        });
        
        function cbScanQCode(data){
            alert("二维码扫描结果为:"+data);
        }
        
        function cbOpenCamera(data){
            alert("拍照后的图片地址为:"+data);
        }
        
        function cbOpenGallery(data){
            alert("打开相册后的图片地址为:"+data);
        }
        
        function cbGetStep(data){
            alert("步数为:"+data);
        }
        
        function cbOrderPay(data){
            alert("支付结果为:"+data);
        }
        
        function cbShowConfirm(){
            alert("点击了确定");
        }
        
        function cbGetDeviceInfo(data){
            alert("硬件信息为"+data);
        }
        
        function cbUploadFile(data){
            alert("上传结果为"+data);
        }
    </script>
</html>
